.showBlock{
  position: fixed;
  bottom: 0;
  right: 0;
  width: 400px;
  height: 300px;
  background-color: #ffffff;
  border: 1px solid #dddddd;
  z-index: 1000;
  zoom: 1;
  padding: 20px 0px 0px 20px;
  box-shadow: -1px -1px 10px #b7ff8a;
  animation:show 2s ease-out forwards;

  .showInfo{
    overflow: scroll;
    width: 360px;
    height: 260px;
    padding-right: 10px;
    margin-top: 10px;
  }
  .hideInfo{
  }
  .closeIcon{
    position: absolute;
    top: 10px;
    right: 10px;
    font-size: 20px;
    cursor: pointer;
    &:hover{
      color: #ff0000;
    }
  }
}
.hideInfoBlock{
  position: fixed;
  bottom: 0;
  right: 0;
  width: 400px;
  height: 300px;
  background-color: #ffffff;
  border: 1px solid #dddddd;
  z-index: 1000;
  zoom: 1;
  padding: 20px 0px 0px 20px;
  box-shadow: -1px -1px 10px #b7ff8a;
  animation:hide 2s ease-out forwards;
  .showInfo{
    overflow: scroll;
    width: 360px;
    height: 260px;
    padding-right: 10px;
    margin-top: 10px;
  }
  .hideInfo{
  }
  .closeIcon{
    position: absolute;
    top: 10px;
    right: 10px;
    font-size: 20px;
    cursor: pointer;
    &:hover{
      color: #ff0000;
    }
  }
}
@keyframes show{
  0%{transform:translate(60px);opacity:0;}
  100%{transform:translate(0);opacity:1;}
}
@keyframes hide{
  0%{transform:translate(0);opacity:1;}
  100%{transform:translate(60px);opacity:0;display: none}
}
